﻿.password-strength {
    .password-strength-text {
        line-height: @line-height-200;
    }

    .passw-strength-indicator {
        margin-bottom: @base-unit * 0.25;
        max-width: @input-max-width;
        width: 100%;
        height: (@base-unit * 0.5);
        background-color: @color-gray-150;

        div {
            height: 100%;
        }
    }

    .password-strength-not-acceptable,
    .password-strength-weak,
    .password-strength-acceptable,
    .password-strength-average,
    .password-strength-strong,
    .password-strength-excellent {
        font-weight: bold;
    }

    .passw-indicator-not-acceptable {
        background-color: @color-red-70;
        width: 0;
    }

    .passw-indicator-weak {
        background-color: @color-red-70;
        width: 20%;
    }

    .passw-indicator-acceptable {
        background-color: @color-orange-80;
        width: 40%;
    }

    .passw-indicator-average {
        background-color: @color-blue-100;
        width: 60%;
    }

    .passw-indicator-strong {
        background-color: @color-green-120;
        width: 80%;
    }

    .passw-indicator-excellent {
        background-color: @color-green-100;
        width: 100%;
    }
}
